<template>
  <div>
    <ehl-dialog-box
      custom-class="_log_list"
      :title="loglist.title"
      :show="loglist.show"
      :show-btn="false"
      @cancel="loglist.show = false"
    >
      <ehl-form :options="loglist.options" :data="loglist.data">
        <!-- 表格的操作的插槽 -->
        <template v-slot:table="{ data }">
          <span
            class="cpt_btn_ico icon-chakanbaogao cpt_margin_10"
            @click="look(data)"
            title="查看"
          />
          <span class="cpt_btn_ico icon-xingzhuang" @click="del(data)" title="删除" />
        </template>
      </ehl-form>
    </ehl-dialog-box>
    <log-detail v-if="logdetailObj.show" :logdetail="logdetailObj" />
  </div>
</template>
<script>
  import Vue from 'vue'
  import superr from '@/common/components/superr.js'
  import { LogDetail } from '@/views/globalExploration/logDetail.vue'
  import ehlForm from '@/common'
  import { Component, Prop } from 'vue-property-decorator'

  export class LogList extends superr {
    title = '日志列表'
    show = false
    options = {
      table: {
        vertical: true, //表单label在上面不是左边
        type: 'table',
        columns: [
          {
            prop: 'index',
            label: '序号',
            width: 100,
          },
          {
            prop: 'createTime',
            label: '开始时间',
          },
          {
            prop: 'modifyTime',
            label: '更新时间',
          },
          {
            prop: 'statusDesc',
            label: '运行结果',
          },
          {
            prop: 'runTime',
            label: '执行时长',
          },
          {
            isOperation: true,
            label: '操作',
          },
        ],
      },
    }
    constructor(data) {
      super(data)
    }
  }

  @Component({
    components: {
      ehlForm,
      ehlDialogBox: () => $import('ehlDialogBox'),
      logDetail: () => import('@/views/globalExploration/logDetail.vue'),
    },
  })
  export default class LogListView extends Vue {
    @Prop({ type: Object }) loglist
    logdetailObj = new LogDetail({})
    look(data) {
      ajax
        .get(`/v2/api/detection/domaindetection/logs/${data.current.id}`)
        .then(res => {
          this.logdetailObj.update({ label: res.data })
          this.logdetailObj.show = true
        })
        .catch(error => {
          $message.error(error)
        })
    }
    async del(data) {
      try {
        await this.$confirm('确定删除吗?', '提示', {
          showClose: false,
        })
        await ajax.delete(`/v2/api/detection/domaindetection/logs/${data.current.id}`)
        $message.success('删除成功')
        this.$emit('reflesh')
      } catch (error) {
        console.log(error)
      }
    }
    mounted() {}
  }
</script>
<style lang="less" scoped>
  /deep/ ._log_list {
    width: 50%;
  }
</style>
